<template>
    <div class="ticket-list-wrapper common-tabs-wrap">
        <Tabs :animated="false" @on-click="handleTabChange" type="card" v-model="currentTab">
            <TabPane :key="item.name" :label="item.label" :name="item.name" v-for="item in ticketTabs" id="ticket">
                <ticket-table :type="item.name" v-if="currentTab === item.name"></ticket-table>
            </TabPane>
        </Tabs>

        <!-- <ticket-exporter :show.sync="exportVisible"></ticket-exporter> -->
    </div>
</template>

<script>
// import ticketCount from '../components/ticket-count';
import ticketTable from './ticket-table'
// import ticketExporter from '../components/ticket-exporter';
export default {
  components: {
    // ticketCount,
    ticketTable
    // ticketExporter
  },
  data () {
    return {
      exportVisible: false,
      currentTab: '1',
      ticketTabs: [
        {
          label: '新装工单',
          name: '1'
        },
        {
          label: '维修工单',
          name: '2'
        },
        {
          label: '拆卸工单',
          name: '3'
        },
        {
          label: '重装工单',
          name: '4'
        }
      ]
    }
  },

  methods: {
    handleExport () {
      this.exportVisible = true
    },

    handleTabChange (name) {
      this.$router.push('/ticket/list/' + name)
    }
  }
}
</script>

<style lang="less">
.ticket-list-wrapper {
    padding-top: 6px;
}
#ticket {
    padding: 0px;
}
</style>
